import Manager, { type TableColumnConfig } from "../../component/Manager/index.tsx";
import dayjs from "dayjs";
import type { DetailFieldConfig, FormItemConfigs } from "../../global.ts";
import AdminTreeSelect from "../../component/AdminTreeSelect/index.tsx";

export default function DepartmentManagerPage() {
  const apiConfig = {
    search: "/v1/admin/department",
    edit: "/v1/admin/department",
    add: "/v1/admin/department",
    delete: "/v1/admin/department",
  };

  const tableColumnConfig = [
    {
      title: "序号",
      dataIndex: "_index",
      key: "_index",
      fixed: "left",
      width: 80,
    },
    {
      title: "部门名称",
      dataIndex: "name",
      key: "name",
      fixed: "left",
    },
    {
      title: "上级部门",
      dataIndex: "parent_id",
      key: "parent_id",
    },
    {
      title: "部门描述",
      dataIndex: "description",
      key: "description",
    },
    {
      title: "部门负责人",
      dataIndex: "leader_id",
      key: "leader_id",
    },
    {
      title: "排序",
      dataIndex: "sort",
      key: "sort",
    },
    {
      title: "状态",
      dataIndex: "is_disabled",
      key: "is_disabled",
      render: (text: number) => text === 1 ? "禁用" : "启用",
    },
    {
      title: "更新时间",
      dataIndex: "updated_at",
      key: "updated_at",
      render: (text: string) => dayjs(text).format("YYYY-MM-DD HH:mm:ss"),
    },
    {
      title: "操作",
      dataIndex: "operate",
      key: "operate",
    },
  ] as TableColumnConfig[];

  const searchFormFieldConfig: FormItemConfigs[] = [
    {
      label: "关键字",
      name: "keyword",
      type: "input",
      placeholder: "部门名称",
    },
    {
      label: "状态",
      name: "is_disabled",
      type: "select",
      options: [
        { label: "启用", value: 0 },
        { label: "禁用", value: 1 },
      ],
    },
  ];

  const formFields: FormItemConfigs[] = [
    {
      label: "部门名称",
      name: "name",
      type: "input",
      rules: [{ required: true, message: "请输入部门名称" }],
    },
    {
      label: "上级部门",
      name: "parent_id",
      type: "custom",
      customNode: (
        <AdminTreeSelect
          treeApiUrl="/v1/admin/department"
          fieldIdentifier={{
            pId: "parent_id",
            title: "name",
          }}
        />
      ),
    },
    {
      label: "部门描述",
      name: "description",
      type: "textarea",
    },
    {
      label: "部门负责人",
      name: "leader_id",
      type: "custom",
      customNode: (
        <AdminTreeSelect
          treeApiUrl="/v1/admin/staff"
          fieldIdentifier={{
            pId: "department_id",
            title: "name",
          }}
        />
      ),
    },
    {
      label: "排序",
      name: "sort",
      type: "number",
    },
    {
      label: "状态",
      name: "is_disabled",
      type: "select",
      options: [
        { label: "启用", value: 0 },
        { label: "禁用", value: 1 },
      ],
      rules: [{ required: true, message: "请选择状态" }],
    },
  ];

  const addFormFieldConfig = formFields;

  const editFormFieldConfig: FormItemConfigs[] = [
    {
      label: "ID",
      name: "id",
      type: "hidden",
    },
    ...formFields,
  ];

  const detailFieldConfig = [
    {
      title: "序号",
      dataIndex: "_index",
    },
    {
      title: "ID",
      dataIndex: "id",
    },
    {
      title: "部门名称",
      dataIndex: "name",
    },
    {
      title: "上级部门",
      dataIndex: "parent_id",
    },
    {
      title: "部门描述",
      dataIndex: "description",
    },
    {
      title: "部门负责人",
      dataIndex: "leader_id",
    },
    {
      title: "排序",
      dataIndex: "sort",
    },
    {
      title: "状态",
      dataIndex: "is_disabled",
      render: (text: number) => text === 1 ? "禁用" : "启用",
    },
    {
      title: "创建时间",
      dataIndex: "created_at",
      render: (text: string) => dayjs(text).format("YYYY-MM-DD HH:mm:ss"),
    },
    {
      title: "更新时间",
      dataIndex: "updated_at",
      render: (text: string) => dayjs(text).format("YYYY-MM-DD HH:mm:ss"),
    },
  ] as DetailFieldConfig[];

  return (
    <Manager
      apiConfig={apiConfig}
      tableColumnConfig={tableColumnConfig}
      searchFormFieldConfig={searchFormFieldConfig}
      editFormFieldConfig={editFormFieldConfig}
      addFormFieldConfig={addFormFieldConfig}
      detailFieldConfig={detailFieldConfig}
      enableAdd
      enableEdit
      enableDelete
      defaultViewType="list"
    />
  );
} 